<template>
	<div class="back_contain_n">
		<!-- 头部搜索 -->
		<div class="Search_Top_Part">
			<div class="search_list">
				<div>
					<div class="input_flex">
						<el-input clearable v-model="queryForm.planCode" placeholder="计划号"></el-input>
					</div>
					<div class="input_flex">
						<el-select clearable v-model="queryForm.planType" placeholder="计划类型">
							<el-option label="订单" value="1"></el-option>
							<el-option label="备货" value="2"></el-option>
						</el-select>
					</div>
					<div class="input_flex">
						<el-select clearable v-model="queryForm.itemId" placeholder="品类">
							<el-option v-for="(item,index) in itemList" :key="index" :label="item"
									   :value="item"/>
						</el-select>
					</div>
					<div class="input_flex">
						<el-input clearable v-model="queryForm.gradeValue" placeholder="规格"></el-input>
					</div>
					<div class="input_flex" v-show="planStatus != '3'">
						<el-select clearable v-model="queryForm.planStatus" placeholder="计划状态">
							<el-option label="待生产" value="1"></el-option>
							<el-option label="生产中" value="2"></el-option>
							<el-option label="已完成" value="3"></el-option>
						</el-select>
					</div>
					<div class="input_flex daterange">
						<el-date-picker v-model="time"
						:picker-options="pickerOptions"
										type="daterange"
										range-separator="-"
										start-placeholder="开始日期"
										end-placeholder="结束日期">
						</el-date-picker>
					</div>
				</div>
			</div>
			<div class="search_bt">
				<span class="zll-search" @click="getList">搜索</span>
				<span class="zll-search-reset" @click="searchReset()">重置</span>
			</div>
		</div>
		<div class="Search_Top_Input" >
			<div class="addNew">
				<span @click="edit({id:''},'beihuo')" v-if="hasRole('plan:produce:stock') && isBHShow"><i
					class="el-icon-circle-plus-outline"></i> 备货计划</span>
			</div>
		</div>
		<!-- table -->
		<sys-table class="m_table"
				   ref="systable1"
				   :isMultipleSelection="false"
				   :tableData="tableData"
				   :tableLoading="tableLoading"
				   :tableHeader="tableHeader"
				   :scopeWidth="120"
				   :backCount="backCount"
				   @getBackData="getList"
		>
			<template slot-scope="scope" slot="operate">
				<el-button @click="edit(scope.row,'see')" type="text" size="small">查看</el-button>
				<el-button v-show="scope.row.planStatus =='1'" @click="edit(scope.row,'edit')"  type="text" size="small">编辑</el-button>
				<el-button v-show="scope.row.planStatus =='2'" @click="completePlan(scope.row,'edit')"  type="text" size="small">完成</el-button>
			</template>
		</sys-table>
		<div class="zll-dialog">
			<popout :title="type == 'edit'?'生产计划 · 编辑':(type =='see'?'生产计划 · 查看':'新建备货计划')" :visible.sync="addDialog"
					v-if="addDialog" class="largeSize">
				<BhDetail ref="add" slot="content"  :type="type" :selectItems="itemList" :editData="editData"></BhDetail>
				<!--<BhDetail v-else ref="add" slot="content"  :type="type" :selectItems="itemList" :editData="editData"></BhDetail>-->
				<template slot="bottom">
					<p class="zll-botton Info" @click="addDialog = false">关 闭</p>
					<p class="zll-botton" v-if="type !== 'see'" @click="()=>{this.$refs.add.submitForm('addForm')}">提
						交</p>
				</template>
			</popout>
		</div>
	</div>
</template>

<script>
	import Detail from './detail'
	import BhDetail from '../table-two/detail'
	import {formatDate} from "@/plugins/formatDate";

	export default {
		data() {
			return {
				tableLoading: true, //table刷新
				type: '',
				editData: {},

				queryForm: {
					planCode: '',
					gradeValue: '',
					itemId: '',
					planType: '',
					planStatus: '',
					notPlanStatus: '',
				},
				backCount: 0,
				tableData: [],
				tableHeader: [],
				addDialog: false,

				gradeList: [],
				itemList:['单支连排','多支','伸缩','U型'],
				time: [],

				planStatus:'',
				notPlanStatus:'',
				isBHShow: false,
				pickerOptions: {
					onPick: ({ minDate }) => {
						this.minDate = minDate
					},
					disabledDate: (time) => {
						if (this.minDate) {
							const oneYear = 365 * 24 * 60 * 60 * 1000
							return time.getTime() < this.minDate.getTime() ||
								time.getTime() > this.minDate.getTime() + oneYear
						}
						return false
					}
				}
			}
		},
		methods: {

			getSysItemList() {
				let self = this;
				self.itemList = [];
				self.$http({
					url: "/jinl/sysItem/getMgItemSelect",
					method: "post",
					data: JSON.stringify({types: ['99']}),
					dataType: 'json',
					contentType: "application/json",
				}).then(resp => {
					if (resp.success) {
						self.itemList = resp.result;
					}
				});
			},

			getOrderGrades() {
				let self = this;
				self.gradeList = [];
				self.$http({
					url: "/jinl/order/getOrderGrades",
					method: "post",
				}).then(resp => {
					if (resp.success) {
						self.gradeList = resp.result;
					}
				});
			},

			completePlan(rowData){
				let self = this;
				self.$confirm('是否确认完成该任务？', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					self.$http({
						url: '/jinl/plan/updateCompletePlanManage',
						method: "post",
						params: {planId: rowData.id}
					}).then(resp => {
						if (resp.success) {
							self.getList();
							self.$message.success('任务已完成！');
							return
						}
						self.$message.error(resp.message);
					});
				});
			},

			deleteRow(rowData) {
				let self = this;
				self.$confirm('是否确认删除？', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					self.$http({
						url: '/jinl/order/deleteOrders',
						method: "post",
						params: {id: rowData.id}
					}).then(resp => {
						if (resp.success) {
							self.getList();
							self.$message.success('删除成功！');
							return
						}
						self.$message.error(resp.message);
					});
				});
			},

			getList(startIndex, pageRow) {
				let self = this;
				self.tableLoading = true;
				if (this.time && this.time.length == 2) {
					//date类型
					self.queryForm.startTime = formatDate(new Date(self.time[0]), 'yyyy-MM-dd')
					self.queryForm.endTime = formatDate(new Date(self.time[1]), 'yyyy-MM-dd') + ' 23:59:59'
				} else {
					self.queryForm.startTime = ''
					self.queryForm.endTime = ''
				}

				let pageInfo = self.$refs.systable1.getPageInfo(startIndex);
				if (pageInfo.pageNum == 0||startIndex == 0) {
					self.$refs.systable1.resetPage();
				}
				self.queryForm.startIndex = pageInfo.pageNum;
				self.queryForm.totalPage = pageInfo.pageSize;
				let param = Object.assign({}, self.queryForm);
				self.$http({
					url: "/jinl/plan/getPlanManageList",
					method: "post",
					data: JSON.stringify(param),
					dataType: 'json',
					contentType: "application/json",
				}).then(resp => {
					if (resp.success) {
						self.tableLoading = false;
						for(let _d of resp.result){
							let totalCompleteNum = 0;
							let completeNum = _d.completeNum;
							if(completeNum){
								totalCompleteNum = (parseFloat(completeNum) * parseFloat(_d.thNumber)).toFixed(4);
							}
							_d.totalCompleteNum = totalCompleteNum+'';
						}
						self.tableData = resp.result;
						self.tableHeader = [
							{"columnValue": "planCode", "columnName": "计划号"},
							{"columnValue": "planTypeCn", "columnName": "计划类型"},
							{"columnValue": "itemTypeId", "columnName": "品类"},
							{"columnValue": "planName", "columnName": "计划名称",overFlow:true},
							{"columnValue": "gradeValue", "columnName": "规格", width: 150,overFlow:true},
							{"columnValue": "thNumber", "columnName": "单件(万支)"},
							{"columnValue": "peieceNum", "columnName": "件数"},
							{"columnValue": "totalNum", "columnName": "计划(万支)"},
							{"columnValue": "totalCompleteNum", "columnName": "已完成(万支)"},
							{"columnValue": "completePercent", "columnName": "完成率"},
							{"columnValue": "planStatusCn", "columnName": "计划状态"},

						];
						if (resp.result.length > 0) {
							self.backCount = resp.result[0].count;
						} else {
							self.backCount = 0;
						}
					}
				});

			},


			edit(val, type) {
				let self = this;
				if(type == 'edit' && val.planStatus != '1'){
					self.$message.warning('计划不在待生产状态，无法编译！');
					return;
				}
				self.addDialog = true;
				self.type = type;
				self.$nextTick(() => {
					self.itemList = JSON.parse(JSON.stringify(self.itemList));
					self.editData = Object.assign({}, val);
				});
			},
			searchReset() { //重置搜索
				this.time = [];
				this.queryForm = {
					planCode: '',
					gradeValue: '',
					itemId: '',
					planType: '',
					planStatus: this.planStatus,
					notPlanStatus: this.notPlanStatus,
				};
				this.getList();
			},

			init(val){
				console.log(val)
				if(val == '2'){
					this.notPlanStatus = '3'
					this.planStatus = ''
					this.isBHShow = true
				}else{
					this.planStatus = val;
					this.notPlanStatus = ''
					this.isBHShow = false
				}
				this.searchReset();
			},

		},
		mounted() {
			let self = this;
			// self.getSysItemList();
			// self.getOrderGrades();
			self.$eventBus.$on("updatePlanJHList", function () {
				self.addDialog = false;
				self.getList()
			})
		},
		components: {
			Detail,BhDetail
		},

	}
</script>

<style lang="scss" scoped>
	@import "@/style/SearchTop.scss";
</style>